<template>
  <a-table :dataSource="data" rowKey="id" bordered :pagination="pagination">
    <a-table-column title="id" dataIndex="id" />
    <a-table-column title="名称" dataIndex="name" />
    <a-table-column title="简写" dataIndex="shortName" />
  </a-table>
</template>

<script>
import { list } from "@/api/Role";

export default {
  name: "Role",
  data() {
    return {
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        showSizeChanger: true,
        pageSizeOptions: ["10", "20"], //每页中显示的数据
        showTotal: total => `共有 ${total} 条数据` //分页中显示总的数据
      },
      loading: false,
      data: []
    };
  },
  created() {
    this.fetch();
  },
  methods: {
    fetch() {
      list(this.pagination.current, this.pagination.pageSize, {}).then(
        response => {
          let resp = response.data;
          if (resp.flag) {
            this.data = resp.data.results;
            this.pagination.total = resp.data.totalCount;
          }
        }
      );
    }
  }
};
</script>

<style scoped></style>
